<style>
    .reply{
        margin: 0 -15px;
        padding: 15px 15px;
        position: relative;
        border-bottom: 1px solid #eee;
        padding-left: 74px;
        position: relative;
    }
    .avatar{
        position: absolute;
        top: 15px;
        left: 15px;
    }
    .avatar-48 {
        width: 48px;
        height: 48px;
    }
    .media-object{
        border-radius: 120px;
    }
    .infos{
        min-height: 48px;
    }
    .info{
        margin-bottom: 6px;
        font-size: 12px;
    }
    .markdown{
        position: relative;
        line-height: 1.8em;
        font-size: 14px;
        text-overflow: ellipsis;
        word-wrap: break-word;
    }
    .comment-btn{
        position: absolute; top: 5px; right: 15px;
    }
</style>
<div class="reply">
    <div class="avatar"><a href="/tangmonk"><img class="media-object avatar-48" src="<%= comment.author && comment.author.githubInfo  && comment.author.githubInfo.avatar_url %>" alt=""></a></div>
    <div class="infos">
        <div class="info">
            <span class="name">
              <a href="#"><%= comment.author && comment.author.username %></a>
            </span>
            <span class="time">
              <%= comment.showHandleCreatedAt() %>
            </span>
            <div class="markdown">
                <textarea class="markdownText" hidden><%= comment.markdown %></textarea>
            </div>
        </div>
    </div>
    <% if(locals.user && comment.author &&  locals.user.mongo_id != comment.author._id) { %>
    <div class="comment-btn btn btn-link">
        <input type="text" value="<%= comment.author.username %>" class="comment-author-username" hidden>
        <input type="text" value="<%= comment.author._id %>" class="comment-author-id" hidden>
        回复
    </div>
    <% } %>
</div>

<script>
    $(function(){
       $('.comment-btn').on('click', function(){
           $(this).css('color', 'gray');
           var username = $(this).find('.comment-author-username').val();
           var userId = $(this).find('.comment-author-id').val();
           $('#comment-input').val('###### `--- @' + username +  ' ---` \n').trigger('input');
           $('#to-user-id').val(userId);
           $('body').scrollTop($('#left-panel').height());
       })
    });
</script>
